import React, { Component } from 'react'
import { View, Text } from '@tarojs/components'
import { AtButton, AtGrid, AtList, AtListItem } from 'taro-ui'

import "taro-ui/dist/style/components/button.scss" // 按需引入
import "taro-ui/dist/style/components/grid.scss"
import './index.less'


export default class Index extends React.Component {

  componentWillMount () { }

  componentDidMount () { }

  componentWillUnmount () { }

  componentDidShow () { }

  componentDidHide () { }

  render () {
    return (
      <View >
        <View className='t-modal-1'>

          <AtList>
            <AtListItem title='已选择10个加油站' extraText='5月25日' />
            <View className='m-info' style=''>
              <View class='m-info_item'>今日加油总计94笔</View>
              <View class='m-info_item'>总计 282324234.71升</View>
            </View>
            <AtListItem title='加油明细' arrow='right' onClick={this.handleClick} />
          </AtList>
        </View>

        <View className='t-modal-1'>
          <AtGrid data={
            [
              {
                image: 'https://img12.360buyimg.com/jdphoto/s72x72_jfs/t6160/14/2008729947/2754/7d512a86/595c3aeeNa89ddf71.png',
                value: '加油列表'
              },
              {
                image: 'https://img20.360buyimg.com/jdphoto/s72x72_jfs/t15151/308/1012305375/2300/536ee6ef/5a411466N040a074b.png',
                value: '油站油价'
              },
              {
                image: 'https://img10.360buyimg.com/jdphoto/s72x72_jfs/t5872/209/5240187906/2872/8fa98cd/595c3b2aN4155b931.png',
                value: '车队账户管理'
              },
              {
                image: 'https://img12.360buyimg.com/jdphoto/s72x72_jfs/t10660/330/203667368/1672/801735d7/59c85643N31e68303.png',
                value: '我的车队'
              },
              {
                image: 'https://img14.360buyimg.com/jdphoto/s72x72_jfs/t17251/336/1311038817/3177/72595a07/5ac44618Na1db7b09.png',
                value: '车队记账管理'
              },
              {
                image: 'https://img30.360buyimg.com/jdphoto/s72x72_jfs/t5770/97/5184449507/2423/294d5f95/595c3b4dNbc6bc95d.png',
                value: '我的员工'
              }
            ]
          }
          />
        </View>
        <View className='m-loginOut'>
          <AtButton type='primary' circle >退出</AtButton>
        </View>
      </View>

    )
  }
}
